﻿@{
    ViewBag.Title = "Empleado";
    Layout = "~/Views/Shared/_LayoutZTK.cshtml";
}

@Styles.Render("~/Content/aciTree.css")
<div style="border: 0px solid #FF3399;">
    <div class="divh2" style="margin-bottom: 5px; padding-left: 5px;">@ViewBag.Title</div>
    <table style="width: 100%; border: 1px solid #31cf60;">
        <tr>
            <td style="width: 180px; padding-left: 5px; padding-right: 5px; vertical-align: top;">
                <table class="tblvios" style="width: 100%">
                    <tr>
                        <td class="td_under">@Html.ActionLink("Añadir", "AddEmployee", "tabsEmpleado", null, new { id = "addEmployeeid" })</td>
                    </tr>
                    <tr>
                        <td class="td_under">Log Entries</td>
                    </tr>
                    <tr>
                        <td class="td_under">Importar</td>
                    </tr>
                    <tr>
                        <td>
                            <div class="td_under">
                                Exportar
                            </div>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <div class="viosbox" id="waitAdicionarDocumentoImage" style="display: none; text-align: center; margin-top: 15px;">
                                <img alt="Loading" src="@Url.Content("~/Images/ajaxanim.gif")" />&nbsp;<span>Cargando ...</span>
                            </div>
                            <div class="viosbox" id="waitLoadDocumentoAreaImage" style="display: none; text-align: center;">
                                <img alt="Loading" src="@Url.Content("~/Images/ajaxanim.gif")" />&nbsp;<span>Cargando ...</span>
                            </div>
                        </td>
                    </tr>
                    <tr>
                        <td class="error">@ViewBag.MessageError</td>
                    </tr>
                </table>
            </td>
            <td style="vertical-align: top;">
                <div id="tabsEmpleados">
                    <ul id="ultabsEmpleadosId">
                        <li><a id="tab0Id" href="tabsDepartamento">Departamento</a></li>
                        <li><a id="tab4Id" href="tabsArea">Area</a></li>
                        <li>@Html.ActionLink("Empleado", "Index", "tabsEmpleado", null, new { id = "tab1Id" })</li>
                        <li><a id="tab2Id" href="tabsRetiros">Retiros</a></li>
                        <li><a id="tab3Id" href="tabsEmitirTarjeta">Emitir Tarjeta</a></li>
                    </ul>
                </div>
            </td>
        </tr>
    </table>
    <div style="display: none;">
        @Html.ActionLink("Añadir Departamento", "AddDepartamento", "tabsDepartamento", new { id = "0" }, new { id = "lnkadicionaDepartamentoid" })
        @Html.ActionLink("Mostrar Arbol", "MostrarDepartamentos", "tabsEmpleado", null, new { id = "lnkMostarArbolId" })
        @Html.ActionLink("Mostrar Arbol Area", "MostrarDepartamentos", "tabsEmpleado", null, new { id = "lnkMostarArbolAreaId" })
    </div>
</div>
<div id="adicionaDepartamentoDialogId">
    Aqui data entry
</div>
<div id="searchdataEmpleadoid" style="display:block;">
@*    &nbsp;Aqui busquedas*@
</div>
<div class="float-right" style="border: 0px solid #6666FF; width: 376px;">
    <div style="border: 0px solid #CCCC00; margin: 5px; padding: 5px; display: block;">
        <div id="treeDeptoid" class="aciTree" style="padding:5px;">
            <span id="arbolTipoId">&nbsp;</span>
        </div>
    </div>
</div>

@section scripts{
    <script type="text/javascript">
        jQuery(document).ready(initialzeEmpleados01);

        //Variable globol requerida por el acitree
        var deptotreeapi;

        function initialzeEmpleados01() {
            //alert('initialzeEmpleados01');
            //debugger;

            //Set the width of the form
            var objHlp = jQuery("#sectionbodyId").css("max-width");
            jQuery("#sectionbodyId").css("max-width", "1140px");

            //Muestra las pestañas
            jQuery("#tabsEmpleados").tabs({ load: loadtabsEmpleados });

            //Iniitialize the tabs
            jQuery("#waitAdicionarDocumentoImage").show();
            jQuery("#tabsEmpleados").tabs("option", "active", 2);

            //Set the buttons
            jQuery(".btSubmitBuscarDeptoArea").button();

            //Attach handlers 
            jQuery("#lnkadicionaDepartamentoid").click(clicklnkadicionaDepartamentoid);
            jQuery("#lnkMostarArbolId").click(clicklnkMostarArbolId);
            jQuery("#lnkMostarArbolAreaId").click(clicklnkMostarArbolAreaId);

            //Prepare the dialogs 
            jQuery("#adicionaDepartamentoDialogId").dialog({ autoOpen: false, modal: true });
        }

        function clicklnkadicionaDepartamentoid(src, arg) {
            src.preventDefault();

            //debugger;

            //Display load image
            jQuery("#waitAdicionarDocumentoImage").show();

            //Get the partial view
            var szUrl = jQuery(src.target).attr("href");

            jQuery.ajax({
                type: 'GET',
                url: szUrl,
                data: null,
                //contentType: 'application/json; charset=utf-8',
                dataType: 'html',
                error: AjaxFailed,
                success: addDeptoSuccess
            });
        }


        function AjaxFailed(response, statusCode, optionerror) {
            //debugger;
            //var response = ajaxContext.get_response();
            //var statusCode = response.get_statusCode();
            alert("Sorry, the request failed with status code: " + statusCode);
        }

        function addDeptoSuccess(response, statusCode) {
            //debugger;
            var objRes = response;

            //Display the response data
            jQuery("#adicionaDepartamentoDialogId").html(objRes);

            //Hide load image
            jQuery("#waitAdicionarDocumentoImage").hide();


            //Create the buttons 
            jQuery("#adicionarDeptoAreasubmitbtn").button();
            jQuery("#adicionarDeptoAreaClosebtn").button();

            //Set dropdow default values
            SetEditAddress();
            SetEditParentDepto();
            SetEditCompant();

            //Attach handlers 
            jQuery("#adicionarDeptoAreaClosebtn").click(clickadicionarDeptoAreaClosebtn);

            //jQuery(".optionBuscarDeptoArea a").each(eachoptionBuscarDeptoArea);

            var szTitle = jQuery("#deptoAreaIdHlp").html();
            szTitle = jQuery.trim(szTitle);

            //Show the dialog (used with the BuscarDepartamento call)
            jQuery("#adicionaDepartamentoDialogId").dialog("option", "title", szTitle);

            //setter
            jQuery("#adicionaDepartamentoDialogId").dialog("option", "width", 600);

            //display the popup dialog
            jQuery("#adicionaDepartamentoDialogId").dialog("open");
        }

        function clickadicionarDeptoAreaClosebtn(src, arg) {
            jQuery("#adicionaDepartamentoDialogId").dialog("close");
        }

        function clicklnkMostarArbolId(src, arg) {
            src.preventDefault();

            //Display load image
            jQuery("#waitAdicionarDocumentoImage").show();

            var szUrlTree = "/tabsEmpleado/getJsonData01?tipodepartamento=Departamento";

            jQuery.ajax({
                type: 'POST',
                url: szUrlTree,
                data: null,
                contentType: 'application/json; charset=utf-8',
                dataType: 'json',
                error: AjaxFailed,
                success: aciDeptotreeAllsuccess
            });
        }

        function clicklnkMostarArbolAreaId(src, arg) {
            //debugger;

            src.preventDefault();

            //Display load image
            jQuery("#waitAdicionarDocumentoImage").show();

            var szUrlTree = "/tabsEmpleado/getJsonData01?tipodepartamento=Area";

            jQuery.ajax({
                type: 'POST',
                url: szUrlTree,
                data: null,
                contentType: 'application/json; charset=utf-8',
                dataType: 'json',
                error: AjaxFailed,
                success: aciAreatreeAllsuccess
            });
        }


        function aciDeptotreeAllsuccess(response, statusCode) {
            //debugger;

            //Muestra el arbol de datos
            if (statusCode == "success") {

                //Hide load image
                jQuery("#waitAdicionarDocumentoImage").hide();

                deptotreeapi = jQuery("#treeDeptoid").aciTree({
                    jsonUrl: null,
                    rootData: response,
                    collapse: true,
                    callbacks: {
                        item: function (parent, item, itemData, level) {
                            //debugger;
                            // a custom item implementation to show the tree level
                            //this.setText(item, itemData.item + ' (' + level + ')');
                        }
                    }
                }).aciTree('api');

                //listening for the events

                //Move the acitree in the DOM
                jQuery("#treeDeptoid").insertBefore("#mostrararbolId");

            }
        }

        function aciAreatreeAllsuccess(response, statusCode) {
            //debugger;

            //Muestra el arbol de datos
            if (statusCode == "success") {

                //Hide load image
                jQuery("#waitAdicionarDocumentoImage").hide();

                deptotreeapi = jQuery("#treeDeptoid").aciTree({
                    jsonUrl: null,
                    rootData: response,
                    collapse: true,
                    callbacks: {
                        item: function (parent, item, itemData, level) {
                            //debugger;
                            // a custom item implementation to show the tree level
                            //this.setText(item, itemData.item + ' (' + level + ')');
                        }
                    }
                }).aciTree('api');

                //listening for the events

                //Move the acitree in the DOM
                jQuery("#treeDeptoid").insertBefore("#mostrararbolAreaId");

            }
        }


        function loadtabsEmpleados(event, ui) {
            //debugger;

            //Hide load image
            jQuery("#waitAdicionarDocumentoImage").hide();
            jQuery(".btSubmitBuscarDeptoArea").button();

            if (ui.panel.selector == "#ui-tabs-1") {
                //debugger;

                //Set buttons 
                //jQuery("#SubmitDepartamentoSearch1").button();
                jQuery(".btEmpleadoNav").button();

                var objLnk = jQuery(".editarDeptoLnk a");

                //Display acitree data
                jQuery("#lnkMostarArbolId").trigger('click');
                jQuery(".editarDeptoLnk a").each(eacheditarDeptoLnk);

                //Attach Handlers 
                jQuery("#lnkadicionaDepartamentoTabsDeptoid").click(clicklnkadicionaDepartamentoid);
                jQuery("#formsearchDeptoidid").submit(submitformsearchDeptoidid);
                jQuery(".deptoNavLnk").each(eachdeptoNavLnk);

                //Display area acitree

            }

            if (ui.panel.selector == "#ui-tabs-2") {
                //debugger;

                //Hide the load image
                jQuery("#waitAdicionarDocumentoImage").hide();

                //Display acitree data 
                jQuery("#lnkMostarArbolAreaId").trigger('click');

                //Set buttons 
                jQuery(".btEmpleadoNav").button();
                //jQuery("#SubmitDepartamentoSearch1").button();

                //Attach handlers
                jQuery("#lnkadicionaAreaTabsDeptoid").click(clicklnkadicionaDepartamentoid);
                jQuery(".editarDeptoLnk a").each(eacheditarDeptoLnk);
                jQuery("#formsearchAreaidid").submit(submitformsearchAreaidid);
                jQuery(".areaNavLnk").each(eachareaNavLnk);

                //debugger;
                //var objHlp = jQuery("#formsearchDeptoidid");
                //jQuery("#formsearchDeptoidid").submit(submitformsearchDeptoidid);
            }

            //#ui-tabs-3
            //Empleados
            if (ui.panel.selector == "#ui-tabs-3") {
                //debugger;


                //Set buttons 
                jQuery("#SubmitEmpleadoSearch1").button();
                jQuery(".btEmpleadoNav").button();

                //Attach handlers  
                //jQuery("#tabsEmpleados").on("tabsbeforeload", beforeLoadEmpleados);
                jQuery("#formsearchEmpleadoid").submit(submitformsearchEmpleadoid);
                jQuery(".editarempleadoaction a").each(eacheditarempleadoaction);
                jQuery(".employeeNavLnk").each(eachemployeeNavLnk);

            }
            if (ui.index == 3) {
                //Hide the load image
                jQuery("#waitAdicionarDocumentoImage").hide();
            }

            if (ui.index == 4) {
                //Hide the load image
                jQuery("#waitAdicionarDocumentoImage").hide();
            }
        }

        function eacheditarempleadoaction(nPos, src) {
            //debugger;
            jQuery(src).click(clickeditarEmpleadoid);
        }

        function clickeditarEmpleadoid(src, arg) {
            //debugger;
            jQuery("#waitLoadDocumentoAreaImage").show();
        }

        function submitformsearchEmpleadoid(src, arg) {
            //debugger;
            src.preventDefault();

            var szUrlForm = jQuery(src.target).attr("action");

            var nPos = -1;
            var szMsg = "";
            var ParmsHlp = src.target.elements;
            var ParmsData01 = "";
            var ParmsData02 = "";
            var ParmsData03 = "";
            var ParmsData04 = "";
            var ParmsData05 = "";
            var ParmsData06 = "";
            var ParmsData07 = "";

            if (ParmsHlp.identificacionid != undefined) {
                ParmsData01 = ParmsHlp.identificacionid.value;
            }

            if (ParmsHlp.nombreid != undefined) {
                ParmsData02 = ParmsHlp.nombreid.value;
            }

            if (ParmsHlp.tarjetaNoid != undefined) {
                ParmsData03 = ParmsHlp.tarjetaNoid.value;
            }

            if (ParmsHlp.celularid != undefined) {
                ParmsData04 = ParmsHlp.celularid.value;
            }

            if (ParmsHlp.departamentosearchid != undefined) {
                ParmsData05 = ParmsHlp.departamentosearchid.value;
            }

            if (ParmsHlp.nsssearchid != undefined) {
                ParmsData06 = ParmsHlp.nsssearchid.value;
            }

            if (ParmsHlp.page != undefined) {
                ParmsData07 = ParmsHlp.page.value;
            }

            nPos = szUrlForm.indexOf("?page");
            if (nPos != -1) {
                szMsg = szUrlForm.substring(nPos + 6);
                nPos = -1;
                nPos = szMsg.indexOf("&");
                if (nPos != -1) {
                    szMsg = szMsg.substring(0, nPos);
                }
                ParmsData07 = szMsg;
            }


            jQuery.ajax({
                type: 'POST',
                url: szUrlForm,
                data: { page: ParmsData07, identificacionid: ParmsData01, nombreid: ParmsData02, tarjetaNoid: ParmsData03, celularid: ParmsData04, departamentosearchid: ParmsData05, nsssearchid: ParmsData06 },
                //contentType: 'application/json; charset=utf-8',
                dataType: 'html',
                error: AjaxFailed,
                success: DeptoBuscarsuccess
            });
        }

        function DeptoBuscarsuccess(response, statusCode) {
            //debugger;

            //Display the response data
            if (statusCode == "success") {
                //Buscar empleado
                jQuery("#searchdataEmpleadoid").html(response);

                jQuery("#searchdataEmpleadoid").insertBefore("#tabsEmpleadodivId");
                jQuery("#tabsEmpleadodivId").remove();

                //Set the nav buttons
                jQuery("#SubmitEmpleadoSearch1").button();
                jQuery(".btEmpleadoNav").button();

                //Attach handlers employeeNavLnk
                jQuery(".employeeNavLnk").each(eachemployeeNavLnk);

                //Buscar Departamento
                jQuery("#searchdataEmpleadoid").insertBefore("#tabsDepartamentodivId");
                jQuery("#tabsDepartamentodivId").remove();

                //Set buttons 
                //jQuery("#SubmitDepartamentoSearch1").button();
                jQuery(".btSubmitBuscarDeptoArea").button();

                //Display acitree data
                //jQuery("#lnkMostarArbolId").trigger('click');
                jQuery(".editarDeptoLnk a").each(eacheditarDeptoLnk);

                //Attach handlers
                jQuery("#lnkadicionaDepartamentoTabsDeptoid").click(clicklnkadicionaDepartamentoid);
                jQuery("#formsearchDeptoidid").submit(submitformsearchDeptoidid);
                jQuery(".deptoNavLnk").each(eachdeptoNavLnk);

                //Buscar Area
                jQuery("#searchdataEmpleadoid").insertBefore("#tabsAreadivId");
                jQuery("#tabsAreadivId").remove();

                //Attach handlers
                jQuery("#lnkadicionaAreaTabsDeptoid").click(clicklnkadicionaDepartamentoid);
                jQuery("#formsearchAreaidid").submit(submitformsearchAreaidid);
                jQuery(".areaNavLnk").each(eachareaNavLnk);

            }
        }

        function eachemployeeNavLnk(nPos, src) {
            //debugger;

            jQuery(src).submit(submitformsearchEmpleadoid);
        }

        function eacheditarDeptoLnk(nPos, src) {
            //debugger;
            jQuery(src).click(clicklnkeditarDepartamentoid);
        }

        function clicklnkeditarDepartamentoid(src, arg) {
            src.preventDefault();

            //debugger;

            //Display load image
            jQuery("#waitAdicionarDocumentoImage").show();

            //Get the partial view
            var szUrl = jQuery(src.target).attr("href");

            jQuery.ajax({
                type: 'GET',
                url: szUrl,
                data: null,
                //contentType: 'application/json; charset=utf-8',
                dataType: 'html',
                error: AjaxFailed,
                success: addDeptoSuccess
            });
        }

        function SetEditAddress() {
            //debugger;
            var szAdrHlp = jQuery("#AddressId").val();

            var selectorHlp = jQuery("#addressIdselectorid")[0];
            if (selectorHlp == null) {
                //selectorHlp.selectedIndex = 1;
            }
            else {
                selectorHlp.selectedIndex = szAdrHlp;
            }
        }

        function SetEditParentDepto() {
            //debugger;

            var szAdrHlp = jQuery("#ParentDepartmentHlpId").val();

            var selectorHlp = jQuery("#parentDepartmentIdselectorid")[0];
            if (selectorHlp == null) {
                //selectorHlp.selectedIndex = 1;
            }
            else {
                //selectorHlp.selectedIndex = szAdrHlp;
                for (var i = 0; i < selectorHlp.length; i++) {

                    if (selectorHlp[i].value == szAdrHlp) {
                        selectorHlp[i].selected = true;
                        break;
                    }
                }
            }
        }

        function SetEditCompant() {
            //debugger;
            var szAdrHlp = jQuery("#CompanyId").val();

            var selectorHlp = jQuery("#CompanyIdselectorid")[0];
            if (selectorHlp == null) {
                //selectorHlp.selectedIndex = 1;
            }
            else {
                selectorHlp.selectedIndex = szAdrHlp;
            }
        }

        function submitformsearchDeptoidid(src, arg) {
            //debugger;
            src.preventDefault();

            var szUrlForm = jQuery(src.target).attr("action");

            var nPos = -1;
            var szMsg = "";
            var ParmsHlp = src.target.elements;
            var ParmsData01 = "";
            var ParmsData02 = "";
            var ParmsData03 = "";
            var ParmsData04 = "";
            var ParmsData05 = "";
            var ParmsData06 = "";
            var ParmsData07 = "";

            if (ParmsHlp.nombredeptoid != undefined) {
                ParmsData01 = ParmsHlp.nombredeptoid.value;
            }

            if (ParmsHlp.descripciondeptoid != undefined) {
                ParmsData02 = ParmsHlp.descripciondeptoid.value;
            }

            //if (ParmsHlp.tarjetaNoid != undefined) {
            //    ParmsData03 = ParmsHlp.tarjetaNoid.value;
            //}

            //if (ParmsHlp.celularid != undefined) {
            //    ParmsData04 = ParmsHlp.celularid.value;
            //}

            //if (ParmsHlp.departamentosearchid != undefined) {
            //    ParmsData05 = ParmsHlp.departamentosearchid.value;
            //}

            //if (ParmsHlp.nsssearchid != undefined) {
            //    ParmsData06 = ParmsHlp.nsssearchid.value;
            //}

            //if (ParmsHlp.page != undefined) {
            //    ParmsData07 = ParmsHlp.page.value;
            //}

            nPos = szUrlForm.indexOf("?page");
            if (nPos != -1) {
                szMsg = szUrlForm.substring(nPos + 6);
                nPos = -1;
                nPos = szMsg.indexOf("&");
                if (nPos != -1) {
                    szMsg = szMsg.substring(0, nPos);
                }
                ParmsData07 = szMsg;
            }


            jQuery.ajax({
                type: 'POST',
                url: szUrlForm,
                data: { page: ParmsData07, nombredeptoid: ParmsData01, descripciondeptoid: ParmsData02 },
                //contentType: 'application/json; charset=utf-8',
                dataType: 'html',
                error: AjaxFailed,
                success: DeptoBuscarsuccess
            });
        }

        function eachdeptoNavLnk(nPos, src) {
            //debugger;

            jQuery(src).submit(submitformsearchDeptoidid);
        }

        function eachareaNavLnk(nPos, src) {
            //debugger;

            jQuery(src).submit(submitformsearchAreaidid);
        }


        function submitformsearchAreaidid(src, arg) {
            //debugger;
            src.preventDefault();

            var szUrlForm = jQuery(src.target).attr("action");

            var nPos = -1;
            var szMsg = "";
            var ParmsHlp = src.target.elements;
            var ParmsData01 = "";
            var ParmsData02 = "";
            var ParmsData03 = "";
            var ParmsData04 = "";
            var ParmsData05 = "";
            var ParmsData06 = "";
            var ParmsData07 = "";

            if (ParmsHlp.nombredeptoid != undefined) {
                ParmsData01 = ParmsHlp.nombredeptoid.value;
            }

            if (ParmsHlp.descripciondeptoid != undefined) {
                ParmsData02 = ParmsHlp.descripciondeptoid.value;
            }

            //if (ParmsHlp.tarjetaNoid != undefined) {
            //    ParmsData03 = ParmsHlp.tarjetaNoid.value;
            //}

            //if (ParmsHlp.celularid != undefined) {
            //    ParmsData04 = ParmsHlp.celularid.value;
            //}

            //if (ParmsHlp.departamentosearchid != undefined) {
            //    ParmsData05 = ParmsHlp.departamentosearchid.value;
            //}

            //if (ParmsHlp.nsssearchid != undefined) {
            //    ParmsData06 = ParmsHlp.nsssearchid.value;
            //}

            //if (ParmsHlp.page != undefined) {
            //    ParmsData07 = ParmsHlp.page.value;
            //}

            nPos = szUrlForm.indexOf("?page");
            if (nPos != -1) {
                szMsg = szUrlForm.substring(nPos + 6);
                nPos = -1;
                nPos = szMsg.indexOf("&");
                if (nPos != -1) {
                    szMsg = szMsg.substring(0, nPos);
                }
                ParmsData07 = szMsg;
            }


            jQuery.ajax({
                type: 'POST',
                url: szUrlForm,
                data: { page: ParmsData07, nombredeptoid: ParmsData01, descripciondeptoid: ParmsData02 },
                //contentType: 'application/json; charset=utf-8',
                dataType: 'html',
                error: AjaxFailed,
                success: DeptoBuscarsuccess
            });
        }

    </script>
}
